<%--
  Created by IntelliJ IDEA.
  User: xh
  Date: 2020/2/12
  Time: 13:22
  To change this template use File | Settings | File Templates.
--%>
<%@ taglib prefix="c" uri="http://java.sun.com/jsp/jstl/core" %>
<%@ page isELIgnored="false"%>
<%@ page contentType="text/html;charset=UTF-8" language="java" %>
<!DOCTYPE html>
<html>
<head>
    <meta charset="UTF-8">
    <title>我的消息 - 技术栈 -Java程序员成长平台</title>
    <meta name="keywords" content="">
    <meta name="description" content>
    <link rel="stylesheet" href="${APP_PATH}/vendor/layui-v2.4.5/layui/css/layui.css">
    <link rel="stylesheet" href="${APP_PATH}/css/common.css">
    <link rel="stylesheet" href="${APP_PATH}/css/header.css">
    <link rel="stylesheet" href="${APP_PATH}/css/footer.css">
    <link rel="stylesheet" href="${APP_PATH}/css/message.css">
    <!-- 让IE8/9支持媒体查询，从而兼容栅格 -->
    <!--[if lt IE 9]>
    <script src="https://cdn.staticfile.org/html5shiv/r29/html5.min.js"></script>
    <script src="https://cdn.staticfile.org/respond.js/1.4.2/respond.min.js"></script>
    <![endif]-->
</head>
<body>
<jsp:include page="head.jsp"></jsp:include>

<div class="g-main layui-main">
    <div class="layui-row">
        <div class="layui-col-xs6">
            <button class="layui-btn layui-btn-sm layui-btn-primary">全部</button>
            <%--<button class="layui-btn layui-btn-sm layui-btn-primary">系统产生</button>--%>
            <%--<button class="layui-btn layui-btn-sm layui-btn-primary">管理员发送</button>--%>
        </div>
        <div class="layui-col-xs6 l-toolbar">
            <button class="layui-btn layui-btn-sm layui-btn-danger layui-icon layui-icon-delete " id="deleteBtn">删除</button>
            <%--<button class="layui-btn layui-btn-sm layui-icon layui-icon-form layui-btn-disabled">标记为已读</button>--%>
            <button class="layui-btn layui-btn-sm layui-icon layui-icon-form" id="ifReadAll">全部标记为已读</button>
        </div>
    </div>
    <div class="layui-row">
        <div class="">
            <form id="messageForm">
            <table  class="layui-table" lay-skin="line">
                <colgroup>
                    <col width="50">
                    <col>
                    <col width="300">
                    <col width="200">
                </colgroup>
                <thead>
                <tr>
                    <th>
                        <input type="checkbox"  lay-skin="primary" id="chkBox" >
                    </th>
                    <th>标题</th>
                    <th>时间</th>
                    <th>类型</th>
                </tr>
                </thead>
                <tbody id="tbody">
                <c:forEach items="${requestScope.page.datas}" var="message" varStatus="status">
                    <c:if test="${message.ifRead==0}">
                        <tr>
                        <td>
                            <input type="checkbox" name="ids" lay-skin="primary"  class="deleteckd" value="${message.id}">
                        </td>
                        <td>
                            <a href="${APP_PATH}/message/toMessage-detail?id=${message.id}">${message.title}
                                    <span class="layui-badge-dot c-dot"></span>
                            </a>
                        </td>
                        <td>${message.sendTime}</td>
                        <td>${message.type}</td>
                    </tr>
                    </c:if>
                    <c:if test="${message.ifRead==1}">
                        <tr class="s-is-read">
                            <td>
                                <input type="checkbox" name="ids" lay-skin="primary"  class="deleteckd" value="${message.id}">
                            </td>
                            <td>
                                <a href="${APP_PATH}/message/toMessage-detail?id=${message.id}">${message.title}</a>
                            </td>
                            <td>${message.sendTime}</td>
                            <td>${message.type}</td>
                        </tr>
                    </c:if>
                </c:forEach>
                </tbody>

            </table>
            </form>
        </div>
    </div>
<div class="page">

    <div id="layui-laypage" class="layui-box layui-laypage layui-laypage-default">
        <c:if test="${requestScope.page.pageNo > 1}">
            <a class="layui-laypage-prev" href="${APP_PATH}/message/toIndex?pageNo=${requestScope.page.pageNo - 1}&userId=${sessionScope.user.id}" data-page="1">上一页</a>
         </c:if>
        <c:if test="${requestScope.page.pageNo <= 1}">
            <a class="layui-laypage-prev layui-disabled" href="#" data-page="0">上一页</a>
        </c:if>

        <c:forEach begin="1" end="${requestScope.page.pageTotal}" var="i" step="1">
            <c:if test="${i == requestScope.page.pageNo}">
                <span class="layui-laypage-curr">
            <em class="layui-laypage-em"></em>
            <em>${i}</em>
             </span>
            </c:if>
            <c:if test="${i != requestScope.page.pageNo}">
                <a href="${APP_PATH}/message/toIndex?pageNo=${i}&userId=${sessionScope.user.id}" data-page="${i}">${i}</a>
            </c:if>
        </c:forEach>

        <c:if test="${requestScope.page.pageNo < requestScope.page.pageTotal}">
            <a class="layui-laypage-next" href="${APP_PATH}/message/toIndex?pageNo=${requestScope.page.pageNo + 1}&userId=${sessionScope.user.id}" >下一页</a>
        </c:if>
        <c:if test="${requestScope.page.pageNo >= requestScope.page.pageTotal}">
            <a class="layui-laypage-next layui-disabled" href="#" >下一页</a>
        </c:if>
    </div>

</div>
</div>

<div class="g-footer layui-clear">
    <hr>
    <div>Copyright ©2018 技术栈(jishuzhan.club), All Rights Reserved.</div>
    <div>渝ICP备13001123号-2</div>
</div>

<script src="${APP_PATH}/vendor/holder.min.js"></script>
<script src="${APP_PATH}/vendor/layui-v2.4.5/layui/layui.all.js"></script>
<script src="${APP_PATH}/js/common.js"></script>
<%--<script src="${APP_PATH}/js/message.js"></script>--%>
<script src="${APP_PATH}/jquery/jquery-2.1.1.min.js"></script>
<script>
  $(function () {

     $("#chkBox").click(function () {
         var ckd = this.checked;
         $(".deleteckd").each(function (a, b) {
             //alert(a);// 第一个参数表示正在遍历的索引
             //alert(b);// 表示正在遍历的元素
             b.checked = ckd;
         })
     });

     $("#deleteBtn").click(function () {
         var length = $(".deleteckd:checked").length;
         if (length <= 0) {
             layer.confirm("请勾选用户信息！", {icon: 3, title: '提示'}, function (cindex) {
                 layer.close(cindex);
             }, function (cindex) {
                 layer.close(cindex);
             });
             return;
         }

         layer.confirm("你确定要删除这些数据吗？", {icon: 3, title: '提示'}, function (cindex) {


             var ids = $("#messageForm").serialize();

             // 将ids传入后台进行批量删除
             var loadingIndex = null;
             $.ajax({
                 url: "${APP_PATH}/message/batchDelete",
                 method: "POST",
                 data: ids,
                 beforeSend: function () {
                     loadingIndex = layer.msg('正在删除数据，请稍候~~', {icon: 16});
                 },
                 success: function (result) {
                     if (result.success) {
                         layer.msg("数据删除成功！", {time: 3000, icon: 6, shift: 2}, function () {
                             // 重新查询数据
                             window.location.href="${APP_PATH}/message/toIndex?pageNo=1&userId=${sessionScope.user.id}";
                         });
                     } else {
                         layer.msg("数据删除失败！", {time: 3000, icon: 5, shift: 6}, null);
                     }
                 },
                 complete: function () {
                     layer.close(loadingIndex);
                 }
             });

             layer.close(cindex);
         }, function (cindex) {
             layer.close(cindex);
         });
     });

      $("#ifReadAll").click(function () {
          var ids = $("#messageForm").serialize();
          var loadingIndex = null;
          $.ajax({
              url: "${APP_PATH}/message/ifReadAll",
              method: "POST",
              data: ids,
              success:function (result) {
                  if (result.success){
                      window.location.href="${APP_PATH}/message/toIndex?pageNo=1&userId=${sessionScope.user.id}";
                  }else {
                      layer.msg("失败！", {time: 3000, icon: 5, shift: 6}, null)
                  }
              },
              complete: function () {
                  layer.close(loadingIndex);
              }
          })
      })
    

  });





</script>
</body>
</html>
